<template>
	<view>
		<view>
			<view class="box">
				<view class="zi">{{$t('index.tel')}}</view>
				<view class="zi2">{{tel}}</view>
			</view>
			<view class="box">
				<view class="zi">{{$t('buymusic.status')}}</view>
				<view class="zi2">{{status==0?$t('buymusic.noregit'):$t('buymusic.regit')}}</view>
			</view>
			<view class="box" style="border: none;">
				<view class="zi">{{$t('mailBill.email')}}</view>
				<u--input :placeholder="$t('mailBill.usemail')" type="text" v-model="email" class="ivu-input"
					style="margin-top: 10px;"></u--input>
			</view>
			<view class="box2">
				<u-button type="defalut" :text="status==0?$t('buymusic.buy'):$t('app.qx')" @click="openAndClose()"
					size="20px" color="#014099" style="margin-top: 30px;"></u-button>
			</view>
			<view class="box3">
				<text>{{$t('mailBill.tishi')}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getResponseData,
		showToastTip,
		getBaseUrl,
		getWsUrl
	} from "@/api/req.js";
	export default {
		data() {
			return {
				tel: "",
				status: 0,
				email: ''
			}
		},
		onLoad: function(option) { //option为object类型，会序列化上个页面传递的参数
			this.tel = uni.getStorageSync("etlSim");
			var that = this;
			getResponseData("/vasBill/getVasBill", 'get', {
			}, function(res) {
				console.log(res);
				that.status = res.data.status;
				that.email = res.data.email;
			});
		},
		methods: {
			openAndClose: function() {
				var that = this;
				getResponseData("/vasBill/openCloseVasBill", 'get', {
					email: that.email,
					status:that.status==1?0:1
				}, function(res) {
					if(res.code==200){
						that.status=that.status==0?1:0;
					}
				});
			}
		}
	}
</script>

<style>
	.box {
		border: 1px #1eb9ee solid;
		width: 70%;
		margin: 0 auto;
		text-align: center;
		margin-top: 20px;
		box-shadow: 3px;
	}

	.box2 {
		width: 70%;
		margin: 0 auto;
	}

	.box3 {
		width: 90%;
		margin: 0 auto;
		margin-top: 30px;
	}

	.zi {
		font-size: 16px;

	}

	.zi2 {
		font-size: 16px;
		/* font-weight: 600; */
		color: gray;
	}
</style>